<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        //  高阶函数：对其他函数进行操作的函数
        //         函数的参数为函数
        //         函数的返回值为函数
        // 异步思想

        // https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Array/filter
        var array1 = [1, -4, 9, 16];
        // pass a function to map
        var map1 = array1.map(function(x){return x*2});
        console.log(map1);
        // expected output: Array [2, -8, 18, 32]
        var map2 = array1.map(Math.abs); //[1, 4, 9, 16]

        function add(x,y,f){
            return f(x) + f(y);
        }
        add(2,3,function(x){return x+1}); //7

        // var x = 1; 
        var obj = {x:23};
        var fun1 = function(){
            return function fun2(){
                return this.x;
            }
        }
        obj.fun3 = fun1;//obj={x:23 fun3:function(){return function fun2() return this.x}}
        obj.fun4 = fun1();
        console.log(obj.fun3()); //fun2(){return this.x;}
        console.log(obj.fun3()()); //undefined // var x = 1; 时 1(this 是window)
        console.log(obj.fun4()); //23

        var div = document.createElement("div");
        document.body.appendChild(div)
        

        //高阶函数——filter
        var persons = [];
        for(var i=15;i<25;i++){
            var tempPerson = {age:i};
            persons.push(tempPerson);
        }
        var fullAgePersons = persons.filter(function(person){
            return person.age > 18;
        });
        console.log(fullAgePersons);
        //  [{age: 19}, {age: 20}, {age: 21},{age: 22}, {age: 23}, {age: 24}]

        var max = 10;
        var fn = function (x) { //max->10
            if(x > max){  
                console.log(max);
            }
        };
        (function (f) {  //max->100
            var max = 100;
            f(15);
        })(fn);//是否有输出，如果有输出的话，输出什么？ 10
    </script>
</body>
</html>